<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>dategrid</title>
	<script type="text/javascript" src="static/easyui/jquery.min.js" charset="utf-8"></script>
	<link rel="stylesheet" href="/static/easyui/themes/default/easyui.css">
	<link rel="stylesheet" href="/static/easyui/themes/icon.css">
	<script type="text/javascript" src="static/easyui/jquery.easyui.min.js" charset="utf-8"></script>
	<script type="text/javascript" src="static/easyui/locale/easyui-lang-zh_CN.js" charset="utf-8"></script>
	<script type="text/javascript">
		$(function(){
			var h = document.documentElement.clientHeight || document.body.clientHeight;
			var w = document.documentElement.clientWidth || document.body.clientWidth;
			$('#t_table').datagrid({
				scrollbarSize:0,
				width:w,
				height:h,
				url:'testlist',
				fitColumns:true,	//宽度是否自适应
				striped:true,	//隔行变色 斑马色
				nowrap:true,	//是否折行 默认true
				idField:'id',
				loadMsg:'数据正在疯狂的加载中...',//加载数据时显示的内容
				pagination:true,
				rownumbers:true,
				rowStyler:function(index1,record){
					/* console.info('index1'+index1);//调试方法
					console.info(record); */
					if(record.username==123){
						return "background:red";
					}
				},
				singleSelect:true,	//单选模式
				/* 冻结列不能同fitColumns 一起使用  
				   frozenColumns:[ [ 
					{field:'id',title:'编号',width:80}
				] ], */
				columns:[ [
					{field:'id',title:'编号',width:80},
					{field:'name',title:'姓名',width:80},
					{field:'endtime',title:'时间',width:80},
					{field:'username',title:'用户名',width:80}
				] ]
			});
			
		});
	</script>
	<style type="text/css">
		body{
			margin: 0px;
		}
	</style>
</head>
<body>
	<table id="t_table"></table>
</body>
</html>